.container::after,
.tab-con::after,
.bilibili-animationone::after,
.bilibili-animationtwo::after,
.headline::after,.zone-wrap-module::after,
.custom-scrollbar::after,
.zhuanlann::after,
.article-cover:after,
.storey-box:after{
	display: table;
	clear: both;
	content: "";
}
.custom-scrollbar{
	height: 420px;
	width: 900px;
}
.zone-wrap-module{
	width: 100%;
	padding-bottom: 30px;
}
.cotainer{
	width: 1160px;
	margin: auto;
}
.marin{
	margin-top: 15px;
}
.marin-banner img{
	margin-bottom: 20px;
    width: 1160px;
    border-radius: 5px;
    height: 96px;
}
.zone{
	margin-bottom: 10px;
	float: left;
	width: 880px;
}
.zone >p{
	margin-top: 8px;
	float: left;
	font-size: 12px;
}
.box{
	width:900px;
	float: left;
	
}
.live{
	float: left;
	display:inline-block;
	width: 40px;
	height: 40px;
	background-image: url(../images/icons.png);
	background-position: -141px -652px;
	margin-right: 8px;
}
.namee{
	font-weight: 400;
	font-size: 24px;
	margin-right: 20px;
	float: left;
	color: black;
}
.namee:hover{
	color: #00A1D6;
}
.more{
	font-size: 12px;
	float: right;
	width: 52px;
    line-height: 27px;
    background-color: #fff;
    border: 1px solid #ccd0d7;
    color: #555;
    border-radius: 4px;
    text-align: center;
    transition: all .2s;
}
.more:hover{
	background-color: #ccd0d7;
}
.more:hover .icon{
	margin-left: 5px;
}
.zx{
	display: inline-block;
    width: 12px;
    height: 13px;
    vertical-align: top;
    transition: all .5s;
    margin-top: 5px;
    background-position: -475px -89px;
    background-image: url(../images/icons.png);
}
.push{
	line-height: 22px;
	font-size: 12px;
	margin-right: 10px;
	float: right;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #ccd0d7;
    border-radius: 4px;
    padding: 2px 10px;
    transition: all .2s;
}
.push>span{
	margin-left: 2px;
	margin-right: 2px;
}
.push:hover{
	background-color: #ccd0d7;
}
.push:hover>i{
	transform: rotate(1turn);
}
.icon{
	background-image: url(../images/icons.png);
	background-position: -478px -218px;
	display: inline-block;
    width: 6px;
    height: 12px;
    margin: -2px 0 0 2px;
    vertical-align: middle;
    transition: all .2s;
}
.onll{
	margin-top: 8px;
    margin-left: 40px;
    padding-right: 10px;
    color: #6d757a;
    float: left;
	font-size: 12px;
}
.onll:hover{
	color: #00A1D6;
}
.onll>i{
	background-image: url(../images/icons.png);
	display: inline-block;
    vertical-align: top;
    background-position: -665px -1113px;
    width: 14px;
    height: 14px;
    margin-top: 1px;
}
.dq>span{
	color: #00A1D6;
}
.card-live-module{
	position: relative;
    width: 160px;
    height: 148px;
    font-size: 12px;
    overflow: hidden;
	float: left;
    margin: 0 20px 20px 0;
}
.pic{
	position:relative;
    width: 160px;
    height: 100px;
    display: block;
    overflow: hidden;
    text-align: center;
    border-radius: 4px;
}
.lazy-img{
	width: 100%;
    height: 100%;
    display: inline-block;
    background-size: 50%;
    background-repeat: no-repeat;
    transition:.5s;
}
.lazy-img img{
	border-radius: 4px;
	display:inline-block;
    width: 100%;
    height: 100%;
}
.t{
	font-size: 12px;
	padding-top:4px;
    height: 40px;
    line-height: 20px;
    transition: all .2s linear;
    color: #222;
    word-wrap: break-word;
    word-break: break-all;
    overflow: hidden;
    text-align: left;
}
.snum{
	color:white;
	position: absolute;
    line-height: 34px;
    width: 100%;
    background: rgba(0,0,0,.5);
    background: linear-gradient(transparent,transparent,rgba(0,0,0,.5));
}
.card-live-module .ssss:hover .numm{
	opacity: 0;
	height: 0;
}
.pic:hover .lazy-img{
	display: none;
}
.pic:hover .maskk{
	opacity: 1;
}
.pic:hover .mask{
	opacity: 1;
}
.maskk{
	opacity:0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    transition:.5s;
    background-image:url(../images/14073662.jpg@.webp);
    background-position: 50%;
    background-size: contain;
}
.card-live-module:hover .t{
	color: #00a1d6;
}
.numm{
	height: 20px;
	position: absolute;
    width: 100%;
    bottom: 0;
    line-height: 20px;
    color: #9ba3ab;
    background-color: #fff;
    transition: all .3s;
}
.autherr{
	line-height: 20px;
    height: 20px;
    display: inline-block;
    width: 47%;
    overflow: hidden;
    font-size: 12px;
    vertical-align: bottom;
    position: absolute;
    color: #fff;
    font-weight: 200;
	white-space: nowrap;
    text-overflow: ellipsis;
    left: 5px;
    bottom:2px;
    text-align: left;
}
.onliner{
	line-height: 20px;
    display: inline-block;
    width: 47%;
    overflow: hidden;
    font-size: 12px;
    vertical-align: bottom;
    position: absolute;
    color: #fff;
    font-weight: 200;
	right: 4px;
	width:75px;
    text-align: right;
    bottom: 0;
}
.onliner i{
	width:13px;
    height: 10px;
    display: inline-block;
    vertical-align: baseline;
    margin-right: 5px;
    background-image:url(../images/zhibo.png);
    background-repeat: no-repeat;
}
.ron{
	width: 260px;
	float: left;
}
.bili-tab{
	float: left;
}
.bili-tab-item{
	font-size: 12px;
	float: left;
    position: relative;
    height: 20px;
    line-height: 20px;
    cursor: pointer;
    padding: 1px 0 2px;
    margin-left: 12px;
    transition: .2s;
    transition-property: border,color;
}
.bili-tab-item:hover{
	color: #00A1D6;
}
.zbph{
	border-bottom: 1px solid rgb(0, 161, 214);
}
.zbph:hover{
	color: rgb(0, 161, 214);
}
.gzzb:hover{
	color: rgb(0, 161, 214);
}
.tab-box{
	margin-top:50px;
	overflow: hidden;
}
.tab-con{
	font-size: 12px;
	height: 40px;
	width: 780px;
    transition: all .3s;
}
.rank{
	width: 260px;
    float: left;
}
.r-item{
	overflow: hidden;
    position: relative;
    margin: 0 0 14px;
	padding-left: 25px;
}
.number{
	background-color: #f25d8e;
	position: absolute;
    color: #fff;
    height: 18px;
    line-height: 18px;
    top: 0;
    left: 0;
    font-size: 12px;
    width: 18px;
    text-align: center;
    z-index: 20;
    border-radius: 4px;
    padding: 0 3px;
    font-weight: bolder;
    float: left;
    margin-right: 6px;
}
.numberr{
	background-color:#b8c0cc;
	position: absolute;
    color: #fff;
    height: 18px;
    line-height: 18px;
    top: 0;
    left: 0;
    font-size: 12px;
    width: 18px;
    text-align: center;
    z-index: 20;
    border-radius: 4px;
    padding: 0 3px;
    font-weight: bolder;
    float: left;
    margin-right: 6px;
}
.lazy-imgg{
	width: 100%;
    height: 100%;
    display: inline-block;
}
.lazy-imgg img{
	width: 40px;
    height: 40px;
}
.r-i{
	width: 180px;
	float: left;
}
.r-i:hover .u-name{
	color: #00A1D6;
}
.preview{
	display: block;
    float: left;
    position: relative;
    margin-right: 12px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
}
.u-name{
	max-width: 135px;
    float: left;
    color: #222;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.u-online{
	max-width: 60px;
    float: right;
    color: #99a2aa;
    line-height: 16px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.u-online i{
	display: inline-block;
    vertical-align: middle;
    width: 12px;
    height: 12px;
    margin-top: -2px;
    margin-right: 3px;
    background: url(../images/live-eye.png) no-repeat;
}
.u-online em{
	font-style: normal;
    font-weight: 400;	
}
.r-i-st{
	float: left;
	margin-top:4px;
    color: #99a2aa;
    overflow: hidden;
    width: 190px;
}
.tab-item{
	width: 260px;
    float: left;
}
.load-state{
	text-align: center;
    padding: 10px 0;
    color: #99a2aa;
    height: 100%;
    display: table;
    width: 100%;
}
.empty{
	vertical-align: middle;
    display: table-cell;
}
.tuijian .panel> img{
	border-radius: 4px;
	width: 260px;
	height: 248px;
}
.picc{
	margin-top: 20px;
    display: inline-block;
}
.bilibili-animation{
	margin-top: 30px;
}
.donghua{
	background-position: -141px -908px;
}
.zone-title{
	padding-right: 20px;
	padding-bottom: 20px;
}
.new-comers-module{
	float: left;
    width: 900px;
}
.headline{
	width: 880px;	
}
.link-more{
	font-size: 12px;
	float: right;
    width: 52px;
    height: 22px;
    line-height: 22px;
    background-color: #fff;
    border: 1px solid #ccd0d7;
    color: #555;
    border-radius: 4px;
    text-align: center;
    margin: 0 0 0 10px;
    transition: all .2s;
}
.m1,.m2{
	margin-top: 8px;
}
.m1{
	border-bottom: 1px solid #00A1D6;
}
.iconn{
	background-image: url(../images/icons.png);
	background-position: -282px -218px;
}
.numm{
	font-size: 12px;
	position: absolute;
	width: 160px;
    bottom: 0;
    height: 20px;
    line-height: 20px;
    color: #99a2aa;
    background-color: #fff;
    transition: all .3s;
}
.danm{
	float: right;
	width: 80px;
    height: 12px;
	display: inline-block;
    vertical-align: top;
}
.bofangliang{
	vertical-align: middle;
	margin-right: 6px;
	display: inline-block;
	width: 12px;
	height: 12px;
	background-image: url(../images/icons.png);
	background-position: -282px -90px;
}
.danmu{
	vertical-align: middle;
	margin-right: 6px;
	display: inline-block;
	width: 12px;
	height: 12px;
	background-image: url(../images/icons.png);
	background-position: -282px -218px;
}
.dw:hover .numm{
	margin-bottom: -20px;
}
.mask :hover .t{
	color: #00A1D6;
}
.silvery{
	z-index: 2;
	background-image: url(../images/icons.png);
	background-position: -849px -212px;
	position: absolute;
    left: 0;
    top: 0;
    width: 40px;
    height: 24px;
    pointer-events: none;
}
.mask{
	overflow: hidden;
}
.silveryy{
	background-image: url(../images/icons.png);
	background-position: -849px -148px;
	z-index: 2;
	position: absolute;
    left: 0;
    top: 0;
    width: 40px;
    height: 24px;
    pointer-events: none;
}
.bilibili-animationtwo .new-comers-module .zone-title .headline .bili-tab .m1{
	border: none;
}
.bilibili-animationtwo .new-comers-module .zone-title .headline .bili-tab .m2{
	border-bottom: 1px solid #00A1D6;
}
.bilibili-animationone{
	float: left;
}
.bilibili-animationtwo{
	float: left;
	display: none;
}
.sec-rank{
    width: 260px;
   	height: auto;
	float: right;
}
.rank-head h3 {
    float: left;
    font-size: 18px;
    font-weight: 400;
}
.rank-head{
	height: 24px;
    line-height: 24px;
}
.bili-dropdown:hover .dropdown-list{
	display: block;
}
.bili-dropdown{
	float: right;
	position: relative;
    display: inline-block;
    vertical-align: middle;
    background-color: #fff;
    cursor: default;
    padding: 0 7px;
    height: 22px;
    line-height: 22px;
    border: 1px solid #ccd0d7;
    border-radius: 4px;
    font-size: 12px;
}
.selected{
	line-height: 20px;
	display: inline-block;
    vertical-align: top;
}
.icon-arrow-down{
	background-image: url(../images/icons.png);
	background-position: -475px -157px;
    display: inline-block;
    vertical-align: middle;
    width: 12px;
    height: 6px;
    margin-left: 5px;
    margin-top: -1px;
}
.dropdown-list{
	position: absolute;
    width: 100%;
    background: #fff;
    border: 1px solid #ccd0d7;
    border-top: 0;
    left: -1px;
    top: 22px;
    z-index: 10;
    display: none;
    border-radius: 0 0 4px 4px;
}
.dropdown-item{
	cursor: pointer;
    margin: 0;
    padding: 3px 7px;
}
.rank-list-wrap{
	width:520px;
    overflow: hidden;
    zoom: 1;
    transition: all .2s linear;
}
.rank-list{
	float: left;
    min-height: 278px;
    padding-top: 20px;
    position: relative;
}
.rank-item{
	position: relative;
    padding-left: 25px;
    margin-top: 20px;
    overflow: hidden;
    margin-bottom: 15px;
    width: 260px;
}
.rank-item:hover .ri-titlee{
	color: #00A1D6;
}
.rank-item:hover .ri-title{
	color: #00A1D6;
}
.ri-preview{
	position: relative;
	margin-right: 5px;
    width: 80px;
    height: 50px;
    float: left;
    border-radius: 4px;
    overflow: hidden;
}
.ri-info-wrap{
	position: relative;
    display: block;
    cursor: pointer;
}
.ri-preview img{
	display: block;
    width: 100%;
    height: 100%;
}
.ri-detail{
	font-size: 12px;
}
.ri-title{
	height:20px;
    line-height: 18px;
    padding: 0;
    overflow: hidden;
    color: #222;
}
.ri-point{
	color: #99a2aa;
	float:left;
}
.ri-titlee{
	overflow: hidden;
	color: #222;
	font-size: 12px;
	float: right;
	height: 36px;
    line-height: 18px;
    margin-top: -3px;
    width: 150px;
    padding: 0;
}
.ri-info-wrap:hover .w-later{
	display: block;
	position: absolute;
	z-index: 2;
}
.warr{
	float: left;
	width: 260px;
	overflow: hidden;
}
.ri-num{
	background-color: #B8C0CC;
	position: absolute;
    color: #fff;
    height: 18px;
    line-height: 18px;
    top: 0;
    left: 0;
    font-size: 12px;
    width: 18px;
    text-align: center;
    z-index: 20;
    border-radius: 4px;
    padding: 0 3px;
    font-weight: bolder;
    float: left;
    margin-right: 6px;
}
.icon-arrow-r{
	background-image: url(../images/icons.png);
	display: inline-block;
    vertical-align: middle;
    background-position: -478px -218px;
    width: 6px;
    height: 12px;
    margin: -2px 0 0 5px;
}
.more-link:hover{
	background-color: #ccd0d7;
    border-color: #ccd0d7;
}
.more-link{
	font-size: 12px;
	float: right;
	width: 260px;
	display: block;
    height: 24px;
    line-height: 24px;
    background-color: #e5e9ef;
    text-align: center;
    border: 1px solid #e0e6ed;
    color: #222;
    border-radius: 4px;
    transition: .2s;
}
.ri-preview>.tirggerr{
	display: none;
}
.rank-item:hover .tirggerr{
	bottom: 0;
	display: block;
}
.bili-tab-itemm{
	cursor: pointer;
	float: left;
	font-size: 18px;
	width: 70px;
    border-color: #e5e9ef;
    text-align: center;
    margin: 0;
    padding: 2px 4px 7px;
}
.bili-tab-itemm:hover{
	color: #00A1D6;
}
.on{
	border-bottom: 1px solid #00A1D6;
	color: #00A1D6;
}
.fanjv{
	float: left;
	font-size: 24px;
    line-height: 24px;
    font-weight: 400;
    margin-right: 20px;
    color: #222;
}
.icon_t{
	background-position: -141px -140px;
}
.c-clink{
	float: right;
    border: 1px solid #f25d8e;
    width: 104px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    color: #f25d8e;
    font-size: 14px;
    border-radius: 4px;
    transition: .1s;
}
.c-clink:hover{
	color: #fff;
    background-color: #f25d8e;
}
.card-timing-module{
	float: left;
	padding: 36px 34px 0 0;
}
.jiantou{
	display: inline-block;
    vertical-align: middle;
    background-position: -478px -281px;
    width: 6px;
    height: 12px;
    margin: -2px 0 0 5px;
	background-image: url(../images/icons.png);
}
.c-clink:hover .jiantou{
	background-position: -541px -218px;
}
.pi{
	width: 72px;
    height: 72px;
    margin-right: 12px;
    display: block;
    float: left;
    position: relative;
    overflow: hidden;
    border-radius: 4px;
}
.r-text{
	float: left;
    width: 96px;
    height: 72px;
    position: relative;
}
.duan{
	font-size: 12px;
	display: block;
    height: 35px;
    text-align: left;
    width: 100%;
    margin-top: -3px;
    color: #222;
    overflow: hidden;
    text-overflow: ellipsis;
}
.duan:hover{
	color: #00A1D6;
	}
.published{
	font-size: 12px;
	background: #ff8eb3;
	color: #fff;
    border-radius: 9px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    padding: 0 4px;
    line-height: 18px;
}
.update{
	position: absolute;
    bottom: 0;
    text-align: left;
    margin-top: 2px;
    color: #aaa;
    left: 0;
    white-space: nowrap;
    line-height: 18px;
}
.publishedd{
	font-size: 12px;
	background:#b8c0cc;
	color: #fff;
    border-radius: 9px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    padding: 0 4px;
    line-height: 18px;
}
.zhouyi,.zhouer,.zhousan,.zhousi,.zhouwu,.zhouliu,.zhouri{
	display: none;
}
.ri-total{
	display: inline-block;
    vertical-align: top;
    color: #99a2aa;
    margin-left: 10px;
}
.panel{
	height:auto;
	width: 260px;
	float: right;
}
header h3{
	float:left; 
	margin-bottom: 30px;
}
.icon_guochuang{
	background-image:"url(../images/icons.png)";
	background-position: -140px -1611px;
}
.yinyue{
	background-position: -140px -266px;
	background-image: url(../images/icons.png);
}

.wudao{
	background-position: -141px -461px;
	background-image: url(../images/icons.png);
}
.youxi{
	background-position: -141px -203px;
	background-image: url(../images/icons.png);
}
.keji{
	background-position: -141px -525px;
	background-image: url(../images/icons.png);
}
.shuma{
	background-position: -141px -1741px;
	background-image: url(../images/icons.png);
}
.shenghuo{
	background-position: -141px -970px;
	background-image: url(../images/icons.png);
}
.guichu{
	background-position: -141px -332px;
	background-image: url(../images/icons.png);
}
.shishang{
	background-position: -141px -718px;
	background-image: url(../images/icons.png);
}
.guanggao{
	background-position: -141px -1228px;
	background-image: url(../images/icons.png);
}
.yvle{
	background-position: -141px -1032px;
	background-image: url(../images/icons.png);
}
.zhuanlan{
	background-position: -141px -1803px;
	background-image: url(../images/icons.png);
}
.article-card{
	margin-top: 15px;
	display: inline-block;
    margin-bottom: 15px;
    font-size: 12px;
}
.article-cover{
	display: inline-block;
    vertical-align: top;
}
.guankanliang{
	vertical-align: text-top;
	display: inline-block;
    width: 14px;
    height: 12px;
    vertical-align: top;
    margin-right: 4px;
	background-position: -345px -218px;
	background-image: url(../images/icons.png);
}
.pinglunliang{
	vertical-align: text-top;
	display: inline-block;
    width: 14px;
    height: 12px;
    vertical-align: top;
    margin-right: 4px;
	background-position: -345px -281px;
	background-image: url(../images/icons.png);
}
.zhuanlann{
	float: left;
	width: 900px;
}
.article-info{
	width: 304px;
	margin-left: 16px;
	float: right;
}
.data{
	margin-top: 6px;
    font-size: 12px;
    color: #99a2aa;
    line-height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.data span{
	width: 75px;
    display: inline-block;
}
.zhuanlannn{
	width: 100px;
	height: 75px;
	float: left;
}
.tipsss{
	font-size: 12px;
    color: #222;
    line-height: 20px;
    height: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
}
.upp a{
	color: #99a2aa;
}
.storey-box{
	width: 880px;
	float: left;
	height: 366px;
}
.dianying{
	background-position: -141px -396px;
	background-image: url(../images/icons.png);
}
.dianshijv{
	background-position: -141px -845px;
	background-image: url(../images/icons.png);
}
.yingshi{
	background-position: -141px -1356px;
	background-image: url(../images/icons.png);
}
.jilu{
	background-position: -141px -1292px;
	background-image: url(../images/icons.png);
}
